{% extends 'wancake/base_nav_frame.html' %}
{% load staticfiles %}
{% block content %}
  <div>
    <p>资源管理</p>
    <div class="row panel panel-default">
      <div class="panel-heading">
        <h4 class="wb-panel-wigdet">用户列表</h4>
        <div class="wb-panel-wigdet-right">
          <button class="btn btn-default" data-wb-url="{{ href_member_add }}" id="wb-member-add">
            <span class="fa fa-plus"></span>添加
          </button>
        </div>
        <div class="clearfix"></div>
      </div>
      <table class="table table-striped table-hover" id="wb-member-list">
      </table>
      <div class="panel-footer" id="wb-member-list-pager">
      </div>
    </div>
  </div>
{% endblock %}
{% block jsscript %}
  <script type="text/javascript">
    $(document).ready(function(e) {

      $("#wb-member-add").button();

      var menberTable = $("#wb-member-list").table({
        columnKeys: ["account", "email", "group", "rule", "isSuper", "opt"]
        , columnNames: ["用户", "邮箱", "分组", "角色", "超级管理员", "操作"]
        , columnBody: function(key, value, data) {
          switch (key) {
            case 'isSuper':
              var span = $("<span />").addClass("glyphicon");
              if (value) {
                span.addClass("glyphicon-ok");
              } else {
                span.addClass("glyphicon-remove");
              }
              return span;
            case 'opt':
              var div = $("<div />");
              var btnEdit = $("<button />").addClass("btn btn-default btn-xs")
                  .attr({
                    type : "button"
                  })
                  .data("token", data.token)
                  .text("编辑");
              btnEdit.click(function(e) {
                var token = $(this).data("token");
                window.location.href = "./member/edit/" + token;
                return false;
              });
              var btnRemove = $("<button />").addClass("btn btn-danger btn-xs")
                  .attr({
                    type : "button"
                  })
                  .css({
                    "margin-left" : "4px"
                  })
                  .data("token", data.token)
                  .text("删除");
              btnRemove.click(function(e) {
                var token = $(this).data("token");
                console.log("remove " + token);
                var dialog = BootstrapDialog.confirm({
                  title : "警告"
                  , message : "确定要删除 " + data.account + " 吗？"
                  , btnOKLabel : "删除"
                  , btnCancelLabel : "算了"
                  , callback : function(yes) {
                    if (yes) {
                      $.ajax("./member/remove", {
                        data : {
                          token: data.token
                        }
                        , type : "POST"
                        , dataType : "json"
                        , success : function(result) {
                          var resultData = $.wUtils.getData(result);
                          if (resultData) {
                            console.log("删除 " + resultData.token);
                            BootstrapDialog.alert({
                              title : "提示"
                              , message : "成功删除 " + data.account
                              , callback : function() {
                                $.wUtils.reload();
                              }
                            });
                          }
                        }
                        , error : function() {}
                      });
                    }
                  }
                });
                return false;
              });
              div.append(btnEdit);
              div.append(btnRemove);

              return div;
            default:
              return value;
          }
        }
      });

      $.ajax("./member/all", {
        data : {
          page : 1
          , pagesize : 10
        }
        , type : "GET"
        , dataType : "json"
        , success : function(data) {
          if (data.resultCode == 1) {
            var memberList = data.data.list;
            if (memberList && memberList.length) {
              menberTable.load(memberList);
              var totalPageSize = data.data.totalPageSize;
              var pager = $("#wb-member-list-pager").pager({
                showCount : 7
                , total : totalPageSize
              }).onSelectPage(function(pageNumber) {
                $.ajax("./member/all", {
                  data : {
                    page : pageNumber
                    , pagesize : 10
                  }
                  , type : "GET"
                  , dataType : "json"
                  , success : function(data) {
                    if (data.resultCode == 1) {
                      var memberList = data.data.list;
                      if (memberList && memberList.length) {
                        menberTable.load(memberList);
                      }
                    }
                  }
                  , error : function() {
                  }
                });
              });
            }
          }
        }
        , error : function() {
        }
      });
    });
  </script>
{% endblock %}
